import React, { Component } from "react";
import { Consumer } from "./context";

class Computed extends Component {
    render() {
        let { data } = this.props;
        // console.log(data)
        return <Consumer>
            {
                (store) => {
                    return <p className="computed">
                        <span onClick={
                            () => this.clickBtn(store, false, data)
                        }>-</span>
                        <span>{data.item.num}</span>
                        <span onClick={
                            () => this.clickBtn(store, true, data)
                        }>+</span>
                    </p>
                }
            }
        </Consumer>
    }
    clickBtn = (store, type, data) => {
        if (type) {
            data.item.num++;

        } else {
            data.item.num--;
            if (data.item.num < 0) {
                data.item.num = 0;
            }
        }
        store.data.group[data.typeIndex].list[data.listIndex].num = data.item.num;


        let allMoney = 0;
        store.data.group.forEach((typeItem) => {
            typeItem.list.forEach(item => {
                if (item.listFlg) {
                    allMoney += item.num * item.price;
                }
            });
        })
        store.data.allPrice = allMoney;

        store.change(store.data)
    }
}

export default Computed;